<template>
  <div>
    <head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>美多商城-首页</title>
	<link rel="stylesheet" type="text/css" href="/static/css/reset.css">
	<link rel="stylesheet" type="text/css" href="/static/css/main.css">
</head>
<body>
	
	<myheader search="true"></myheader>

	<div class="navbar_con">
		<div class="navbar">
			<h1 class="fl">商品分类</h1>
			<ul class="navlist fl">
				<li><a href="">首页</a></li>
				<li class="interval">|</li>
				<li><a href="">真划算</a></li>
				<li class="interval">|</li>
				<li><a href="">抽奖</a></li>
			</ul>
		</div>
	</div>

	<div class="pos_center_con clearfix">
		<ul class="slide">
			<li><a href="#"><img src="/static/images/slide01.jpg" alt="幻灯片01"></a></li>
			<li><a href="#"><img src="/static/images/slide02.jpg" alt="幻灯片02"></a></li>
			<li><a href="#"><img src="/static/images/slide03.jpg" alt="幻灯片03"></a></li>
			<li><a href="#"><img src="/static/images/slide04.jpg" alt="幻灯片04"></a></li>
		</ul>
		<div class="prev"></div>
		<div class="next"></div>
		<ul class="points">
			<!-- <li class="active"></li>
			<li></li>
			<li></li>
			<li></li> -->
		</ul>
		<ul class="sub_menu">			
			<li v-for="(group,index) in group_list" :key="index">
				<div class="level1">
					<a href="#" v-for="cate1 in group.cate1_list" :key="cate1.id">{{cate1.name}}</a>
				</div>
				<div class="level2">
					<div class="list_group" v-for="cate2 in group.cate2_list" :key="cate2.id">
						<div class="group_name fl">{{cate2.name}} &gt;</div>
						<div class="group_detail fl">
							<a href="#" v-for="cate3 in cate2.cate3_list" :key="cate3.id">{{cate3.name}}</a>
						</div>						
					</div>
				</div>
			</li>
		</ul>
	</div>

	<div class="list_model" v-for="(item,index1) in goods_list" :key="index1">
		<div class="list_title clearfix">
			<h3 class="fl" id="model01">{{index1+1}}F {{item.cate.name}}</h3>
		</div>
		<div class="goods_con clearfix">
			<div class="goods_banner fl">
				<img src="/static/images/banner01.jpg">
			</div>
			<ul class="goods_list fl">
				<li v-for="one in item.goodses" :key="one.id">					
					<router-link :to="{'path':'/detail','query':{'id':one.id}}" class="goods_pic"><img :src="'http://127.0.0.1:8000/'+one.pic"></router-link>
					<h4><a href="#" :title="one.name">{{one.name}}</a></h4>
					<div class="prize">¥ {{one.price}}</div>
				</li>
				
			</ul>
		</div>
	</div>

	


	<div class="footer">
		<div class="foot_link">
			<a href="#">关于我们</a>
			<span>|</span>
			<a href="#">联系我们</a>
			<span>|</span>
			<a href="#">招聘人才</a>
			<span>|</span>
			<a href="#">友情链接</a>		
		</div>
		<p>CopyRight © 2016 北京美多商业股份有限公司 All Rights Reserved</p>
		<p>电话：010-****888    京ICP备*******8号</p>
	</div>
</body>
  </div>
</template>

<script>

import myheader from '@/components/Header'

export default {
	data(){
		return {
			group_list:[],
			goods_list:[],
			
		}
	},
	components:{
		myheader
	},
	created(){
		this.axios.get("/index").then(resp=>{
			console.log(resp.data)
			this.group_list=resp.data.cate_list
			this.goods_list=resp.data.goods_list
		}).catch(error=>{
			console.log(error)
		})
	}
}
</script>

<style>

</style>